<template>
   
  <el-card class="form-container" shadow="never">
    <el-form
      :model="adminSysNotice"
      :rules="rules"
      ref="AdminSysNoticeFrom"
      label-width="150px"
    >
      <el-form-item label="标题" prop="emailTitle">
        <el-input
          v-model="adminSysNotice.emailTitle"
          style="width: 370px"
          placeholder="请输入标题"
        />
      </el-form-item>
      <!-- <el-form-item label="公告类型：" prop="noticeType" v-if="false">
				<el-radio-group v-model="adminSysNotice.noticeType">
					<el-radio :label="1">通知</el-radio>
					<el-radio :label="2">公告</el-radio>
				</el-radio-group>
			</el-form-item> -->
      <el-form-item label="内容" prop="emailDetail">
        <el-input
          class="input-width"
          type="textarea"
          :rows="5"
          v-model="adminSysNotice.emailDetail"
          style="width: 370px"
          placeholder="请输入内容"
        />
      </el-form-item>
      <!-- <el-form-item label="是否显示：" v-if="false">
				<el-radio-group v-model="adminSysNotice.status">
					<el-radio :label="1">是</el-radio>
					<el-radio :label="0">否</el-radio>
				</el-radio-group>
			</el-form-item> -->
      <!-- <el-form-item label="备注" prop="remark">
				<el-input v-model="adminSysNotice.remark" style="width: 370px;" />
			</el-form-item> -->
      <el-form-item label="会员" prop="member">
        <!-- Transfer 穿梭框 -->
        <template width="700px">
          <el-transfer
            :titles="['未选中', '已选中']"
            v-model="value"
            :data="data"
            filterable
            :filter-method="filterMethod"
            filter-placeholder="请输入会员昵称"
          >
          </el-transfer>
        </template>
      </el-form-item>
      <el-form-item>
        <el-button @click="cancel">取消</el-button>
        <!-- <el-button v-if="!isEdit" @click="resetForm('AdminSysNoticeFrom')">重置</el-button> -->
        <el-button type="primary" @click="onSubmit('AdminSysNoticeFrom')"
          >确定</el-button
        >
      </el-form-item>
    </el-form>
  </el-card>
</template>
<script>
import {
  createAdminEmail,
  getAdminSysNotice,
  updateAdminSysNotice,
} from "@/api/sys/adminEmail";
import SingleUpload from "@/components/Upload/singleUpload";
import {
  getAllEmailMemberList,
  getMemberList,
  addCenterUserSysNotice,
} from "@/api/centers/message";

const defaultAdminSysNotice = {};
export default {
  name: "AdminEmailDetail",
  components: {
    SingleUpload,
  },
  props: {
    isEdit: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    // Transfer 穿梭框
    const generateData = (_) => {
      const data = [];
      var userIds = [];
      let p = new Promise((resolve, reject) => {
        getAllEmailMemberList({pageNum:1,pageSize:99999})
          .then((res) => {
            console.log(res)
            resolve(res);
          })
          .catch((err) => {
            reject(res);
          });
      });
      Promise.all([p]).then((res) => {
        const members = res[0].data.records;
        members.forEach((member, index) => {
          // console.log(member)
          data.push({
            label: `${
              member.email +
              "	"+
              member.id +
              "：" +
              member.nickname +
              "	" +
              member.phone +
              "	"  +
               
              member.level
            }`,
            key: member.id,
            pinyin: `${member.nickname}`,
          });
          userIds.push(member.id);
        });
        this.data = data;
        console.log(data)
        return data;
      });
    };
    return {
      adminSysNotice: Object.assign({}, defaultAdminSysNotice),
      rules: {
        emailTitle: [
          {
            required: true,
            message: "请输入标题",
            trigger: "blur",
          },
          {
            min: 1,
            max: 50,
            message: "长度在 1 到 50 个字符",
            trigger: "blur",
          },
        ],
        emailDetail: [
          {
            required: true,
            message: "请输入内容",
            trigger: "blur",
          },
          {
            min: 1,
            max: 2000,
            message: "长度在 1 到 2000 个字符",
            trigger: "blur",
          },
        ],
      },
      // Transfer 穿梭框
      data: generateData(),
      value: [],
      filterMethod(query, item) {
        return item.pinyin.indexOf(query) > -1;
      },
    };
  },
  created() {
    console.log(this.isEdit);
    if (this.isEdit) {
      getAdminSysNotice(this.$route.query.id).then((response) => {
        console.log(response);
        this.adminSysNotice = response.data;
      });
    } else {
      this.adminSysNotice = Object.assign({}, defaultAdminSysNotice);
    }
    if (this.isEdit) {
      getMemberList(this.$route.query.id).then((res) => {
        // console.log(res)
        if (res.code === 200) {
          res.data.forEach((user, index) => {
            console.log(user);
            this.value.push(user.userId);
          });
        }
      });
    }
  },
  methods: {
    onSubmit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.$confirm("是否提交数据", "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          }).then(() => {
            this.adminSysNotice.memberIds = this.value.toString();
            createAdminEmail(this.adminSysNotice).then((response) => {
              console.log(response);
              if (response.code == 200) {
                this.$refs[formName].resetFields();
                this.adminSysNotice = Object.assign({}, defaultAdminSysNotice);
                this.$message({
                  message: "提交成功",
                  type: "success",
                  duration: 1000,
                });
                this.$router.back();
              } else {
                this.$message({
                  message: response.msg,
                  type: "error",
                  duration: 1000,
                });
              }
            });
          });
        } else {
          this.$message({
            message: "验证失败",
            type: "error",
            duration: 1000,
          });
          return false;
        }
      });
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
      this.adminSysNotice = Object.assign({}, defaultAdminSysNotice);
    },
    cancel() {
      this.$router.back();
    },
  },
};
</script>
<style>
.form-container {
  width: 1000px;
}

div.el-transfer {
  width: 800;
}

.el-transfer-panel {
  width: 300px;
  /* height: 500px; */
}

.el-transfer-panel__list.is-filterable {
  /* height: 500px; */
}
</style>
